<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<%@ include file="../../common/jsp/sheetHeader.jsp" %>
<script>
	$(document).ready(function() {
		//sheet 초기화  
		createIBSheet2(document.getElementById("viewArea"),"mySheet","100%","400px");
		
		var cfg = {SearchMode:smLazyLoad, Page:30};
		var headers = [
			{Text:"모델번호|평형|단가(A)|판매가(B)\nA * 1.03 / 100|현금구입가(C)\n A * 0.9 / 100|할부구입가(D)\nA * 0.93 / 100|현금부담액\nB-C|할부부담액\nB-D", Align:"Center"}
		];
		var info = {Sort:1,ColMove:1,ColResize:1,HeaderCheck:0};
		var cols = [
			{Type:"Text",Width:130},
			{Type:"Text",Width:100,ColMerge:0},
			{Type:"Int",Width:80,SaveName:"A", Align:"Right",ColMerge:0},
			{Type:"AutoSum",Width:85,SaveName:"B",Format:"#,##0.00",CalcLogic:"|A|*1.03/100", Align:"Right",ColMerge:0},
			{Type:"AutoSum",Width:85,SaveName:"C",Format:"#,##0.00",CalcLogic:"|A|*0.9/100", Align:"Right",ColMerge:0},
			{Type:"AutoSum",Width:85,SaveName:"D",Format:"#,##0.00",CalcLogic:"|A|*0.93/100", Align:"Right",ColMerge:0},
			{Type:"AutoAvg",Width:85,Format:"#,##0.00",CalcLogic:"|B|-|C|", ColMerge:1, Align:"Right",ColMerge:0},
			{Type:"AutoAvg",Width:85,Format:"#,##0.00",CalcLogic:"|B|-|D|", Align:"Right",ColMerge:0}
		];

		mySheet.SetConfig(cfg);
		mySheet.InitHeaders(headers,info);
		mySheet.InitColumns(cols);

		mySheet.FitColWidth();
		
		doAction("search");
	});
	
	/*Sheet 각종 처리*/
	function doAction(sAction) {
		
		switch(sAction) {
			case "search":		//조회
				mySheet.DoSearch("../data/sheet_data2.xml");
				break;
			case "subsum":
			    var info = [{StdCol:0, SumCols:"2|3|4|5", ShowCumulate:0,Sort:0,CaptionCol:0}];
			   	mySheet.ShowSubSum(info); 
			   	doAction('search');
		    break;
		}
	}
	
	function showSubSum() {
		var stdcol		= parseInt($('#stdcol').val());
		var sumcols		= $('#sumcols').val();
		
		var sort		= parseInt($("#sort option:selected").val());
		var cumulate	= parseInt($("#showcumulate option:selected").val());
		
		var captioncol	= $('#captioncol').val();
		var captiontext	= $('#captiontext').val();
		var avgcols		= $('#avgcols').val();
		
		var text = { StdCol:stdcol, SumCols:sumcols, Sort:sort , ShowCumulate:cumulate,
				CaptionCol:captioncol, CaptionText:captiontext, AvgCols:avgcols };

		var info = [ text ];
		mySheet.ShowSubSum(eval(info));
		doAction('search');
	}
	
</script>
<title>소계/다중컬럼 소계 예제</title>
</head>
<body>
<div id="main">
	<%@ include file="../../common/jsp/sheetNavi.jsp" %>
	<div id="title">소계/다중컬럼 소계 예제</div>
	<div id="desc">
		ShowSubSum 메서드는 특정 컬럼의 데이터를 기준으로 소계와 누계를 계산하여 표시한다.<br>
		이 함수는 데이터를 조회하는 메소드를 호출하기 이전에 호출하여야 하며, 설정을 변경한 경우 다시 데이터를 조회하여야 적용된다.<br>
		<br>
		SumCols는 소계와 누계가 계산 되어야 할 컬럼의 Index를 "|"로 연결한 문자열로 해당 컬럼에 소계와 누계가 계산되어 표시된다.<br>
		<br>
		ShowCumulate를 1 설정하면 소계를 표시하고 그 아랫줄에 해당하는 소계의 누계가 계산되어 표시되고, 0으로 설정하면 소계만 계산하여 표시된다.<br>
		누계 기능은 다음과 같이 계산된다. 첫번째 누계는 첫번째 소계와 동일하며, 두번째 누계는 첫번째 소계와 두번째 소계를 합한 것이고, 마지막 누계는 이전 소계들을 모두 합한것이다.<br>
		누계 기능은 소계가 계산될때만 표시 되는 기능으로 처리된다.<br>
		<br>
		AvgCols 인자는 평균으로 계산 되어야 할 컬럼의 Index를 "|"로 연결한 문자열로 해당하는 컬럼에 평균이 계산되어 표시된다.<br>
		<br>
		CaptionText 인자는 소계를 대표글자의 포맷을 변경하여 설정할 때 사용한다.<br>
		설정하지 않은 경우는 "소계 : " + 기준값로 설정된다.<br>
		소계(누계) 표현시 "%s" 를 사용하며 기준 값은 "%col"을 사용하여 포맷을 설정 할 수있다.<br>
		예를 들어 "%s = %col"으로 설정한 경우 소계행은 소계 = 기준값, 누계행은 누계 = 기준값으로 표시된다.<br>
		소계를 표시하는 행은 첫번째 컬럼에 "소계 : " + 기준값으로 표시되고, 누계를 표시하는 행은 "누계 : " + 기준값으로 표시된다.<br>
		<br>
		인자값은 JSON 형태의 포맷으로 설정 한다.<br>
		예) var info = {StdCol:2, SumCols:"2|3|4", ShowCumulate:1, AvgCols:"5|6"};<br>
		<br>
		<table border="1" style="border-spacing: 1px; border-style: none; border-color: #CCCCCC;">
			<tr style="text-align:center">
				<td width="70">파라미터</td>
				<td width="50">타입</td>
				<td width="50">필수여부</td>
				<td width="200">설명</td>
			</tr>
			<tr style="text-align:center">
				<td>StdCol</td>
				<td>Long/String</td>
				<td>필수</td>
				<td align="left">기준 컬럼 Index 또는 SaveName</td>
			</tr>
			<tr style="text-align:center">
				<td>SumCols</td>
				<td>String</td>
				<td>필수</td>
				<td align="left">소계가 계산되어야 할 컬럼 Index를 "|"로 연결한 문자열</td>
			</tr>
			<tr style="text-align:center">
				<td>Sort</td>
				<td>Boolean</td>
				<td>선택</td>
				<td align="left">기준 컬럼의 Sort 처리 여부. 소계를 표시 하기 위해 기준 컬럼의 값이 반드시 Sort 되어 있어야 함.<br>Default=1</td>
			</tr>
			<tr style="text-align:center">
				<td>ShowCumulate</td>
				<td>Boolean</td>
				<td>선택</td>
				<td align="left">소계에 대한 누계 표시 여부.<br>Default=0</td>
			</tr>
			<tr style="text-align:center">
				<td>CaptionCol</td>
				<td>Long</td>
				<td>선택</td>
				<td align="left">소계 대표 글자인 "소계:" + 기준값을 설정할 컬럼<br>Default=숨겨지지 않은 첫컬럼</td>
			</tr>
			<tr style="text-align:center">
				<td>CaptionText</td>
				<td>String</td>
				<td>선택</td>
				<td align="left">소계 대표 글자 포맷을 설정<br>Default=소계(누계): + 기준값</td>
			</tr>
			<tr style="text-align:center">
				<td>AvgCols</td>
				<td>String</td>
				<td>선택</td>
				<td align="left">소계 행에 평균으로 계산되어야 할 컬럼 Index를 "|"로 연결한 문자열.<br>Default=""</td>
			</tr>
		</table>
	</div>

	<div id="functionArea">
		<span>
			기준 컬럼 : <input id="stdcol" size="2" type="text" value="0"/>
			소계 컬럼 : <input id="sumcols" size="8" type="text" value="2|3|4|5"/>
			소트 여부 :
			<select id="sort">
				<option value="0" selected>정렬 X</option>
				<option value="1">정렬 O</option>
			</select>
			누계 표시 여부 :
			<select id="showcumulate">
				<option value="0" selected>숨김</option>
				<option value="1">보기</option>
			</select>
			<br>
			소계 표시 컬럼 : <input id="captioncol" size="2" type="text" value=""/>
			소계 대표 글자 포맷 : <input id="captiontext" type="text" value=""/>
			평균으로 계산되어야할 컬럼 : <input id="avgcols" size="2" type="text" value=""/>
			<input type="button" value="적용하기" onclick="showSubSum();">
		</span>
	</div>
	
	<div id="viewArea">
	</div>
</div>
</body>
</html>